﻿<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Register.ascx.cs" Inherits="UserControls_Register" %>
<%@ Register Src="~/UserControls/Widget.ascx" TagName="Widget" TagPrefix="uc" %>


<div id="masthead">
    <div class="container_24">
        <div class="grid_24">
            <h2 id="heading"> Đăng ký Tài khoản</h2>

        </div>
        <div class="clear"></div>
    </div>
</div>


<div id="content">
    <div class="container_24">


        <div class="grid_15">

            <ul id="tabify">

                <li class="active"><a href="#register">Thông tin đăng ký</a></li>

            </ul>


            <div class="tab_content rounded shadow" id="register">
                <div class="box">
                    <h6>Nếu chưa có tài khoản, bạn có thể
                                 đăng ký mới bằng cách hoàn thành các thông tin theo yêu cầu</h6>
                    <div id="status" class="status"></div>
                    <h4>Thông tin đăng nhập (*)</h4>
                    <hr />

                    <div class="accordion">

                        <div id="login-form" class="contact-form clearfix">

                            <br />
                            <label for="name">Tên đăng nhập: <span class="required">*</span></label>
                            <input type="text" id="username" name="name" value="" placeholder="Đà Lạt Cooking" autofocus onblur="return $.dalatcooking.jsonPersonCheckUserNameAvalidate(this.value);" />

                            <label for="email">Email: <span class="required">*</span></label>
                            <input type="text" id="email" name="email" value="" placeholder="dalatcooking@example.com" onblur="return $.dalatcooking.jsonPersonCheckEmail(this.value);" />

                            <label for="rpassword">Mật khẩu: <span class="required">*</span></label>
                            <input type="password" id="rpassword" name="rpassword" value="" placeholder="Mật khẩu" />


                            <label for="rpassword2">Nhập lại mật khẩu: <span class="required">*</span></label>
                            <input type="password" id="rpassword2" name="rpassword2" value="" placeholder="Nhập lại mật khẩu" />
                            <input type="button" id="btnSimpleRegister" value="Đăng ký" class="submit-button btn" onclick="return $.dalatcooking.jsonPersonRegisterSimple();" />

                            <p id="P3"><span class="required" style="color: red">*</span> Bắt buộc nhập</p>

                        </div>
                    </div>
                    <h4>Thông tin cá nhân (*)</h4>
                    <hr />
                    <div class="accordion">


                        <div id="information-form" class="contact-form clearfix">

                            <br />
                            <label for="fname">Họ và tên đệm: <span class="required">*</span></label>
                            <input type="text" id="fname" name="fname" value="" placeholder="Họ và tên đệm" autofocus />

                            <label for="lname">Tên: <span class="required">*</span></label>
                            <input type="text" id="lname" name="lname" value="" placeholder="Tên" />

                            <label for="birthday">Ngày sinh: <span class="required">*</span></label>
                            <input type="date" id="birthday" name="birthday" value="" placeholder="Ngày sinh" />
                            <label for="avarta">Ảnh đại diện:</label>
                            <input type="text" id="avarta" name="avarta" placeholder="Ảnh đại diện" />

                            <label for="aboutme">Giới thiệu ngắn: </label>
                            <textarea id="aboutme" placeholder="Giới thiệu về bản thân bạn"></textarea>



                            <input type="button" value="Đăng ký" class="submit-button btn" />

                            <p id="P1"><span class="required">*</span> Bắt buộc nhập</p>

                        </div>
                    </div>
                    <h4>Thông tin liên hệ</h4>
                    <hr />
                    <div class="accordion">


                        <div id="contact-form" class="contact-form clearfix">

                            <br />
                            <label for="company">Tên công ty: </label>
                            <input type="text" id="company" name="company" value="" placeholder="Công ty" />

                            <label for="address1">Địa chỉ nhà riêng: </label>
                            <input type="text" id="address1" name="address1" value="" placeholder="Địa chỉ nhà riêng" />

                            <label for="address2">Địa chỉ cơ quan: </label>
                            <input type="text" id="address2" name="address2" value="" placeholder="Địa chỉ cơ quan" />
                            <label for="phonenumber1">Điện thoại nhà riêng:</label>
                            <input type="text" id="phonenumber1" name="phonenumber1" placeholder="Điện thoại nhà riêng" />

                            <label for="phonenumberx">Điện thoại Cơ quan:</label>
                            <input type="text" id="phonenumberx" name="phonenumberx" placeholder="Điện thoại cơ quan" />


                            <label for="phonenumber2">Di động:</label>
                            <input type="text" id="phonenumber2" name="phonenumber2" placeholder="Di động" />

                            <label for="fax">Fax:</label>
                            <input type="text" id="fax" name="fax" placeholder="Fax" />


                            <label for="email1">Email liên hệ:</label>
                            <input type="text" id="email1" name="email1" placeholder="Email liên hệ" />


                            <label for="email2">Email thay thế:</label>
                            <input type="text" id="email2" name="email2" placeholder="Email thay thế" />

                            <label for="city">Thành phố: </label>
                            <input type="text" id="city" placeholder="Thành phố" />


                            <label for="state">Vùng miền (State): </label>
                            <input type="text" id="state" placeholder="Vùng miền" />
                            <label for="zipcode">ZIP Code: </label>
                            <input type="text" id="zipcode" placeholder="" />
                            <label for="country">Quốc gia: </label>
                            <input type="text" id="country" placeholder="Quốc gia" />


                            <input type="button" value="Đăng ký" class="submit-button btn" />

                            <p id="P2"><span class="required">*</span> Bắt buộc nhập</p>

                            <div class="clear"></div>
                        </div>

                    </div>
                    <div class="clear"></div>
                </div>
            </div>
        </div>

        <uc:Widget ID="rightWidget" runat="server" />


    </div>
</div>
<script type="text/javascript">
    $(document).ready(function () {
        // Ẩn tất cả .accordion trừ accordion đầu tiên
        $("#register .accordion:not(:first)").hide();
        // Áp dụng sự kiện click vào thẻ h3
        $("#register h4").click(function () {
            // chọn .accordion (do phần tử đi đi ngay sau phần tử h3 nên ta dùng .next())
            $accordion = $(this).next().next(); // h4 -> hr -> accordion => next 2 lan
            // Kiểm tra nếu đang ẩn thì sẽ hiện và ẩn các phần tử khác
            // Nếu đang hiện thì click vào h3 sẽ ẩn
            if ($accordion.is(':hidden') === true) {
                $("#register .accordion").slideUp();
                $accordion.slideDown();
            } else {
                $accordion.slideUp();
            }
        });

    });
</script>
